import React from "react";
import {Menu,Checkbox} from 'antd';
import './index.less';
import Lefts from './../../resource/navleftlis';
import { NavLink } from 'react-router-dom';
const SubMenu = Menu.SubMenu;
export default class Navleft extends React.Component{

    componentWillMount(){
       const MenudataNode =  this.renderMenu(Lefts);

       this.setState({
           MenudataNode
       })
    }

    renderMenu = (data)=>{

        return data.map((item)=>{
            if(item.children){
               return(
                   <SubMenu title = {item.Ctitle} key={item.key}>
                       {this.renderMenu(item.children)}
                   </SubMenu>
               )
            }

            return <Menu.Item title = {item.Ctitle} key={item.key}>
              <NavLink to={item.key}> {item.Ctitle} </NavLink>
            </Menu.Item>
        })
    }



    constructor (props){
        super(props);
        this.state = {
            count:'0',
            Change:'0',
            B1:'E',
            theme:'dark',
        }
    }

    changeDay = ()=>{
        this.setState({
            B1:'C'
        })
    }

    changeCulr = (e)=>{
        if(e.target.checked){
            this.setState({
                theme:'light'
            })
        }else{
            this.setState({
                theme:'dark'
            })
        }

        
    }

    render(){
        return(
            <div className='Leftside'>
                <div className='Min'>
                    <div className='top'>
                        <img src='/logo.svg' alt=''/>
                        <p>首页</p>
                    </div>
                    {/* <Button onClick={this.changeDay}>{this.state.B1}</Button> */}
                    <Checkbox onClick={this.changeCulr}>{this.state.theme}</Checkbox>
                    <Menu
                      theme={this.state.theme}
                    >
                        {this.state.MenudataNode}
                    </Menu>
                </div>
            </div>
        )
    }
}